<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="../common/jspcommon.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>线路 - 爽客网</title>
<%@include file="../common/js.jsp" %>
<script type="text/javascript" src="js/jquery.ying.js"></script>
<%@include file="../common/css.jsp" %>
<link href="css/detail.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
<!--[if ie]><script src="js/common/iepng.js" type="text/javascript"></script><![endif]-->
<!--[if ie 6]><link href="css/jrIE6.css" type="text/css" rel="stylesheet"><![endif]-->
<!--[if ie]><link href="css/jrIE.css" type="text/css" rel="stylesheet"><![endif]-->
</head>
<body>
<!-- head -->
<%@include file="../common/header.jsp" %>
<!-- head -->
    <!-- wrap-->
    <div class="wrap">
    	<div class="main">
    		
            <!-- content-->
            <div class="m_maininfo">
                <div class="m_info_title clearfix">
                	<h1 class="m_info_title_txt">${product.name}</h1>
                </div>
                <div class="m_info_wrap clearfix">
                	<!--left-->
                	<div class="m_info_left fl">
                    	<!-- lunbo -->
                    	<div class="m_lunbo_wrap clearfix">
                        	<ul class="lunbo_bigpic fl">
                            	<li><img src="${product.image1}" width="444" height="222" /></li>
                                <li><img src="${product.image2}" width="444" height="222" /></li>
                                <li><img src="${product.image3}" width="444" height="222" /></li>
                                <li><img src="${product.image4}" width="444" height="222" /></li>
                            </ul>
                            <ul class="lunbo_smallpic fl">
                            	<li class="current">
                                	<img src="${product.image1}" width="97" height="71" />
                                    <span class="zz_panel"></span>
                                </li>
                                <li>
                                	<img src="${product.image2}" width="97" height="49" />
                                    <span class="zz_panel"></span>
                                </li>
                                <li>
                                	<img src="${product.image3}" width="97" height="49" />
                                    <span class="zz_panel"></span>
                                </li>
                                <li>
                                	<img src="${product.image4}" width="97" height="49" />
                                    <span class="zz_panel"></span>
                                </li>
                            </ul>
                        </div>
                        <!-- lunbo--end -->
                       <!-- calendar-->
                       <div class="m_calendar_wrap">
                       		<div class="m_calendar_box" id="m_calendar_box1">
                            	<h1>出行日价格表</h1>
                                <div class="m_calendar_m">
                                	<div class="m_calendar_btnwrap">
                                		<span class="global1_bg m_btn m_btn_prev" nowdate="${todayPrice.spDate}" isabled="false"></span>
                                    </div>
                                    <div class="m_calendar_btnwrap">
                                        <span class="m_month">${nowMonth}月</span>
                                        <span class="global1_bg m_btn m_btn_next" id="next_month_btn" nowdate="${todayPrice.spDate}" isabled="false"></span>
                                    </div>
                                </div>
                                <!-- month-->
                                <ul class="m_calendar_t clearfix">
                                	<li>星期日</li>
                                    <li>星期一</li>
                                    <li>星期二</li>
                                    <li>星期三</li>
                                    <li>星期四</li>
                                    <li>星期五</li>
                                    <li>星期六</li>
                                </ul>
                                <ul class="m_calendar_d clearfix">
                                	<c:forEach items="${resPriceList}" var="resPrice" end="41">
                                		<li
                                		<c:if test="${resPrice.priceComHas}">onclick="COOL.popBookProduct('${product.id}','${resPrice.spDate }');"</c:if>
                                		>
	                                    	<div class="m_calendar_info <c:if test="${not empty resPrice.priceA}">m_monthbg m_calendar_hover</c:if><c:if test="${empty resPrice.priceA}">m_monthbg1</c:if>">
	                                        	<span class="m_day">${fn:substring(resPrice.spDate,8,10)}</span>
	                                            <span class="m_fullmonth" style="display:none;"></span>
	                                            <span class="m_balance"></span>
	                                            <c:if test="${resPrice.priceComHas}"><span class="m_price"><c:if test="${not empty resPrice.priceA}">¥${resPrice.priceA}</c:if></span></c:if>
	                                        </div>
	                                    </li>
                                	</c:forEach>
                                	
                                    
                                </ul>
                              	<!-- month--end-->
                            </div>
                           
                           <div class="m_calendar_box" id="m_calendar_box2" style="display: none;">
                            	<h1>出行日价格表</h1>
                                <div class="m_calendar_m">
                                	<div class="m_calendar_btnwrap">
                                		<span class="global1_bg m_btn m_btn_prev m_btn_prev_gray" id="prev_month_btn"></span>
                                    </div>
                                    <div class="m_calendar_btnwrap">
                                        <span class="m_month">${nextMonth}月</span>
                                        <span class="global1_bg m_btn m_btn_next m_btn_next_gray"></span>
                                    </div>
                                </div>
                                <!-- month-->
                                <ul class="m_calendar_t clearfix">
                                	<li>星期日</li>
                                    <li>星期一</li>
                                    <li>星期二</li>
                                    <li>星期三</li>
                                    <li>星期四</li>
                                    <li>星期五</li>
                                    <li>星期六</li>
                                </ul>
                                <ul class="m_calendar_d clearfix">
                                	<c:forEach items="${resPriceList}" var="resPrice" begin="42">
                                		<li
                                		<c:if test="${resPrice.priceComHas}">onclick="COOL.popBookProduct('${product.id}','${resPrice.spDate }');"</c:if>
                                		>
	                                    	<div dateTime="${resPrice.spDate}" class="m_calendar_info <c:if test="${not empty resPrice.priceA}">m_monthbg m_calendar_hover</c:if><c:if test="${empty resPrice.priceA}">m_monthbg1</c:if>">
	                                        	<span class="m_day">${fn:substring(resPrice.spDate,8,10)}</span>
	                                            <span class="m_fullmonth" style="display:none;"></span>
	                                            <span class="m_balance"></span>
	                                            <c:if test="${resPrice.priceComHas}"><span class="m_price"><c:if test="${not empty resPrice.priceA}">¥${resPrice.priceA}</c:if></span></c:if>
	                                        </div>
	                                    </li>
                                	</c:forEach>
                                	
                                    
                                </ul>
                              	<!-- month--end-->
                            </div>
                       </div>
                       <!-- calendar--end-->
                    </div>
                    <!--left--end-->
                    <!-- right-->
                    <div class="m_info_right fr">
                    	<div class="p5">
                        	<div class="m_info_txt">
                            	<span>爽客价：<strong>¥<em>${product.priceMin}</em></strong></span>
                                <span>市 场 价：<i class="m_market_price">¥${product.priceMarket}</i> </span>
                                <span>支付方式：<c:if test="${product.payFrom=='01'}">在线支付</c:if><c:if test="${product.payFrom=='02'}">景区支付</c:if></span>
                            </div>
                            <form action="toprobuy.htm" method="post" id="tobuy_form">
                            <input type="hidden" value="${product.id}" name="tid"/>
                            <div class="m_book">
                            	<dl>
                                	<dt>预定日期：</dt>
                                	<dd class="fl">
                                    	<div class="m_book_select mb10">
                                        	<select id="udate" name="udate">
                                        		<c:forEach items="${tpList}" var="resPrice">
                                        			<c:if test="${not empty resPrice.priceA && resPrice.priceComHas}">
                                        				<option value="${resPrice.spDate}" price="${resPrice.priceA}">${resPrice.spDate}（${resPrice.week}）  ￥${resPrice.priceA}</option>
                                        			</c:if>
                                        		</c:forEach>
                                            </select>
                                        </div>
                                        <div class="m_ticket_price clearfix mb10">
                                        	<span class="fl">价格<i class="clrf60 farial ml10 mr10" id="select_price">(¥${todayPrice.priceA})</i></span>
                                            <div class="fl">
                                            	<span class="m_minus"></span><input type="text" class="m_buy_num" value="1" name="count" id="res_nums" /><span class="m_plus"></span>
                                            </div>
                                        </div>
                                        <div class="m_bookbtn_area">
                                        	<a href="javascript:;" class="m_bookbtn" id="tobuy"></a>
                                            <div class="fl">
                       						<a href="javascript:void(0)" class="m_collect_btn"  onclick="keep('${product.id}','product')" >我要收藏</a>
									        <a href="javascript:void(0)" class="m_collect_btn m_recommend" onclick="dianping('${product.id}','product')">我要点评</a>
                                            </div>
                                        </div>
                                    </dd>
                                   
                                </dl>
                                <div class="m_otherinfo">
                                    <p>您可先进行预订,客服将在工作时间致电,为您提供咨询服务咨询</p>
                                    <p class="mt10">预订热线：<i class="clrc06 fb">${servicePhone.value}</i></p>
                            	</div>
                            </div>
                             </form>
                        </div>
                        <dl class="m_notice">
                        	<dt>公告</dt>
                            <dd>
                            	${product.notice}
                            </dd>
                        </dl>	
                    </div>
                    <!--right--end-->
                </div>
            </div>
            <!-- content--end-->
            
            <!--manager recommend-->
            <div class="m_tj_box">
            	<h1>产品经理推荐</h1>
                ${product.recommend}
            </div>
            <!--manager recommend--end-->
            
            <!-- detailmenu-->
            <ul class="scroll_nav mb10">
            	<li class="current">
                	<a href="#special">产品特色</a>
                </li>
                <li>
                	<a href="#feeInfo">费用说明</a>
                </li>
                <li>
                	<a href="#notify">重要提示</a>
                </li>
                <li>
                	<a href="#tripsay">行程说明</a>
                </li>
            </ul>
            <!-- detailmenu--end-->
            <!--menushow-->
            <div class="m_secnav_wrap">
            	<a name="special"></a>
            	<h3 class="m_title">
                	<span>产品特色</span>
                </h3>
                <div class="m_box">
                	${product.special}
                </div>
            </div>
            <div class="m_secnav_wrap" id="tripsay">
            	<a name="special"></a>
            	<h3 class="m_title">
                	<span>行程说明</span>
                </h3>
                <div class="m_box">
                	${product.tripInfo}
                </div>
            </div>
            <div class="m_secnav_wrap">
            	<a name="feeInfo"></a>
            	<h3 class="m_title">
                	<span>费用说明</span>
                </h3>
                <div class="m_box">
                   ${product.feeInfo}
                </div>
            </div>
           
            <div class="m_secnav_wrap">
            	<a name="notify"></a>
            	<h3 class="m_title">
                	<span>重要提示</span>
                </h3>
                <div class="m_box">
                   ${product.notify}
                </div>
            </div>
             <!-- dianping -->
            <div class="com_dp_box">
                    	<div class=" dp_scores">
                            <h1 class="title">${product.name }</h1>
                            <p class="dp_nums"><span>${product.name }</span> 共有点评<i class="clrf60">${countAll}</i>个</p>
                            <dl>
                                <dt><span class="txt_tip">总体评价：</span><span class="star_s2 star_s2_${countInt}"></span><i class="ml5 clrc06">${countPJ}分</i></dt>
                                <dd><span class="star_s2 star_s2_5"></span><span class="process_bar"><i style="width:${countBy5/countAll*100}%"></i></span><span class="ml10">${countBy5}条</span></dd>
                                <dd><span class="star_s2 star_s2_4"></span><span class="process_bar"><i style="width:${countBy4/countAll*100}%"></i></span><span class="ml10">${countBy4}条</span></dd>
                                <dd><span class="star_s2 star_s2_3"></span><span class="process_bar"><i style="width:${countBy3/countAll*100}%"></i></span><span class="ml10">${countBy3}条</span></dd>
                                <dd><span class="star_s2 star_s2_2"></span><span class="process_bar"><i style="width:${countBy2/countAll*100}%"></i></span><span class="ml10">${countBy2}条</span></dd>
                                <dd><span class="star_s2 star_s2_1"></span><span class="process_bar"><i style="width:${countBy1/countAll*100}%"></i></span><span class="ml10">${countBy1}条</span></dd>
                            </dl>
                            <a href="#" class=" dp_btn1"><img src="../images/smallpic/btn_3.gif" onclick="dianping('${product.id}','product');" /></a>
                    	</div>
                        <div class="user_comments">
                        	<a name="discussa"></a>
                        	<ul class="user_dp_det">
	                        	<c:forEach items="${dList}" var="discuss">
	                            	<li>
	                                	<div class="com_lr">
	                                        <div class="l_box">
	                                            <a href="#" class="block"><img src="${discuss.imageServer}${discuss.avatar}" class="pic" /></a>
	                                            <span class="name">${discuss.memberName}</span>
	                                        </div>
	                                        <div class="r_box">
	                                        	<p><span class="mr10">总体评价：</span><span class="star_s2 star_s2_${discuss.overall}"></span></p>
	                                            <p>
		                                            <span class="mr30">
		                                            	人气：<c:if test="${discuss.popul==1}">很烂</c:if>
		                                					<c:if test="${discuss.popul==2}">一般</c:if>
							                                	<c:if test="${discuss.popul==3}">还好</c:if>
							                                	<c:if test="${discuss.popul==4}">较好</c:if>
							                                	<c:if test="${discuss.popul==5}">很好</c:if>
		                                            </span>
		                                            <span class="mr30">
		                                          	    娱乐：<c:if test="${discuss.recreation==1}">很烂</c:if>
						                                		<c:if test="${discuss.recreation==2}">一般</c:if>
						                                		<c:if test="${discuss.recreation==3}">还好</c:if>
						                                		<c:if test="${discuss.recreation==4}">较好</c:if>
						                                		<c:if test="${discuss.recreation==5}">很好</c:if>
		                                            </span>
		                                            <span class="mr30">
		                                            	服务：<c:if test="${discuss.serving==1}">很烂</c:if>
						                                	<c:if test="${discuss.serving==2}">一般</c:if>
						                                	<c:if test="${discuss.serving==3}">还好</c:if>
						                                	<c:if test="${discuss.serving==4}">较好</c:if>
						                                	<c:if test="${discuss.serving==5}">很好</c:if>
		                                            </span>
		                                            <span class="mr30">
		                                            	规模：<c:if test="${discuss.proportion==1}">很烂</c:if>
						                                	<c:if test="${discuss.proportion==2}">一般</c:if>
						                                	<c:if test="${discuss.proportion==3}">还好</c:if>
						                                	<c:if test="${discuss.proportion==4}">较好</c:if>
						                                	<c:if test="${discuss.proportion==5}">很好</c:if>
		                                            </span>
	                                            </p>
	                                            <p>${discuss.content}</p>
	                                            <div class="result">
	                                            	<span class="fr">
	                                            		<fmt:formatDate value="${discuss.gmtCreated}" pattern="MM-dd HH:mm" />
	                                            	</span>
	                                            </div>
	                                        </div>
	                                	</div>
	                                </li>
	                            </c:forEach>    
                            </ul>
                        </div>
                    </div>
            <!-- dianping--end -->
            <div class="in_tabs_wrap">
	           	<div class="content_box">
	               	 <div class="title">
	                    	地图
	                    </div>
	                    <div class="content">
	                    	<div id="baidu_map" style="width: 980px;height: 300px;"></div>
	                    </div>
	               </div>
	           </div>
        </div>
        	
    </div>
    
    <!-- foot-->
    <%@include file="../common/footer.jsp" %>
    <!-- foot--end-->
    <script type="text/javascript">
		$(function(){
			$("#tobuy").click(function(){
				if(COOL.checkLogin()){
					$("#tobuy_form").submit();
				}else{
					COOL.memberLogin();
				}
				
			});
			
			$(".m_first").mouseover(function(){
				$(this).next(".m_down_menu").show();
				$(this).css({"z-index":"11"});
				//$(this).parent().siblings().css({"z-index":"7"});
			});
			$(".m_first").mouseout(function(){
				$(this).next(".m_down_menu").hide();
				$(this).css({"z-index":"9"});
			});
			
			$("#udate").change(function(){
				var price = $(this).find("option:selected").attr("price");
				$("#select_price").text("(¥"+price+")");
			});
			
			$("#next_month_btn").click(function(){
				$("#m_calendar_box1").hide();
				$("#m_calendar_box2").show();
			});
			
			$("#prev_month_btn").click(function(){
				$("#m_calendar_box2").hide();
				$("#m_calendar_box1").show();
			});
			
		});	
		COOL.showMap("baidu_map","${product.lng}","${product.lat}");
		 
	</script>
</body>
</html>
